<!doctype html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/app.css"/>
		<script src="js/mui.min.js"></script>
		<script type="text/javascript">
			mui.init()
		</script>
		<style type="text/css">
			.titleAp p{color: #333333;}
			.titleAp p:nth-of-type(1){font-size: 18px;}
			.titleAp p:nth-of-type(2){font-size: 12px;}
			.titleAp p:nth-of-type(3){font-size: 16px;color: #FF6767;}
			.textAp p{color: #666666;line-height: 25px;}
			.textAp p:nth-of-type(1){color: #333333;font-size: 16px;font-weight: bold;}
			.textAp p:nth-of-type(1) span{color: #999999;font-size: 10px;margin: 0 0 0 3px;}
			.colorFont21{font-size: 14px;text-align: center;}
			.colorFont21+div{font-size: 14px;text-align: center;}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-active mui-icon mui-icon-back"></a>
		    <h1 class="mui-title">详情</h1>
		</header>
		<div class="mui-content">
		    <img src="image/1ddadd4abbd793789eb0147dc57ae93c.jpg" width="100%"  alt="" />
			<ul class="mui-table-view">
				<li class="mui-table-view-cell">
		    		<div class="mui-media-body titleAp">
		    			<p>法国原瓶进口红酒凯旋干红葡萄酒</p>
			    		<p>礼盒装750ml*6</p>
			    		<p>￥29.9</p>
		    		</div>
		    	</li>
		    	<li class="mui-table-view-cell">
		    		<div class="mui-media-body textAp">
		    			<p>商品详情<span>DETAILS</span></p>
			    		<p>商品名称：法国直采 干红葡萄酒</p>
			    		<p>国家：法国</p>
			    		<p>产地：科比埃产区</p>
			    		<p>规格：750毫升</p>
			    		<p>酒精度：13%</p>
			    		<p>醒酒时间：半个小时</p>
			    		<p>成分：葡萄汁，二氧化硫</p>
		    		</div>
		    	</li>
		    </ul>
		    <img style="padding: 11px 15px;" src="image/1ddadd4abbd793789eb0147dc57ae93c.jpg" width="100%"  alt="" />
			<p class="titleCenterS">法国原瓶进口红酒凯旋干红葡萄酒</p>
			<ul class="mui-table-view mui-grid-view">
			    <li class="mui-table-view-cell mui-media mui-col-xs-6">
			        <a href="#">
			            <img class="mui-media-object" src="http://placehold.it/400x300">
			            <div class="mui-media-body colorFont21">会呼吸的酒封</div>
			            <div class="mui-media-body">封瓶后保持呼吸 酒质香</div>
			        </a>
			    </li>
			   	<li class="mui-table-view-cell mui-media mui-col-xs-6">
			        <a href="#">
			            <img class="mui-media-object" src="http://placehold.it/400x300">
			            <div class="mui-media-body colorFont21">会呼吸的酒封</div>
			            <div class="mui-media-body">封瓶后保持呼吸 酒质香</div>
			        </a>
			    </li>
			</ul>
		    <img style="padding: 11px 15px;" src="image/1ddadd4abbd793789eb0147dc57ae93c.jpg" width="100%"  alt="" />
		</div>
		<nav class="mui-bar mui-bar-tab">
		    <p class="mui-pull-left" style="width: 30%;height: 100%;margin: 0 10px;line-height: 50px;">￥29.9</p>
		    <button class="mui-pull-right" style="width: 50%;height: 100%; background: #5763FF;color: #FFFFFF;">立即购买</button>
		</nav>
	</body>
	
</html>